<template>
    <div>
        <el-form
            ref="form3"
            :model="form"
            :rules="rules"
            label-width="100px"
            label-position="top"
        >
            <el-row :gutter="30">
                <el-col :span="24" v-if="applicationType == 3">
                    <el-form-item label="公司标准模版" prop="newTemplateObj">
                        <div>
                            <el-select
                                v-model="form.newTemplateObj"
                                value-key="value"
                                placeholder="请选择公司标准模版"
                                style="width: 20%"
                                @change="getCompanyContractTemplateDetail"
                            >
                                <el-option
                                    v-for="item in list"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item"
                                >
                                </el-option>
                            </el-select>
                            <el-button
                                v-if="form.newTemplateObj"
                                style="margin-left: 15px"
                                type="text"
                                @click="goTemplateDetail"
                                >查看</el-button
                            >
                        </div>
                    </el-form-item>
                </el-col>
                <el-col :span="24" v-else-if="applicationType == 4">
                    <el-form-item label="公司客户模版" prop="contractAnnex">
                        <div class="flex">
                            <!--                            <image-common info="上传附件" :limit="20" v-model="form.contractAnnex"></image-common>-->
                            <word-upload
                                info="上传附件"
                                :limit="1"
                                is-show-tip
                                v-model="form.contractAnnex"
                                @uploadSuccess="uploadSuccess"
                            ></word-upload>
                        </div>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item>
                        <el-checkbox
                            v-model="form.onlyThis"
                            :true-label="1"
                            :false-label="2"
                            >仅适用于此额度申请</el-checkbox
                        >
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="相关配置">
                        <el-row :gutter="20">
                            <el-col :span="8">
                                <div class="agreedItem">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle">逾期还车</span>
                                        <e-switch
                                            v-model="form.overdue"
                                        ></e-switch>
                                    </div>
                                    <el-form-item
                                        prop="overdueParam"
                                        :rules="{
                                            required: true,
                                            message: '请输入逾期还车规则',
                                            trigger: ['blur', 'change'],
                                            validator: (
                                                rule,
                                                value,
                                                callback
                                            ) =>
                                                validData(
                                                    rule,
                                                    value,
                                                    callback,
                                                    form.overdue
                                                ),
                                        }"
                                    >
                                        <div
                                            class="agreedContent flex-row-center"
                                        >
                                            逾期日租金:原日租金
                                            <el-input
                                                style="
                                                    width: 100px;
                                                    margin: 0 8px;
                                                "
                                                v-model="form.overdueParam"
                                                onkeyup="value=value.replace(/[^0-9.]/g,'')"
                                                @input="checkOverdueParam"
                                                @blur="overdueParamBlur"
                                                :disabled="
                                                    form.overdue == 2
                                                        ? true
                                                        : false
                                                "
                                            ></el-input>
                                            %
                                        </div>
                                    </el-form-item>
                                </div>

                                <div class="agreedItem">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle">异地还车</span>
                                        <e-switch
                                            v-model="form.offsite"
                                        ></e-switch>
                                    </div>
                                    <el-form-item
                                        prop="offsiteParam"
                                        :rules="{
                                            required: true,
                                            message: '请输入异地还车规则',
                                            trigger: ['blur', 'change'],
                                            validator: (
                                                rule,
                                                value,
                                                callback
                                            ) =>
                                                validData(
                                                    rule,
                                                    value,
                                                    callback,
                                                    form.offsite
                                                ),
                                        }"
                                    >
                                        <div
                                            class="agreedContent flex-row-center"
                                        >
                                            单价:
                                            <el-input
                                                style="
                                                    width: 100px;
                                                    margin: 0 8px;
                                                "
                                                v-model="form.offsiteParam"
                                                :disabled="
                                                    form.offsite == 2
                                                        ? true
                                                        : false
                                                "
                                                onkeyup="value=value.replace(/[^0-9.]/g,'')"
                                                @input="checkOffsiteParam"
                                                maxlength="9"
                                            ></el-input>
                                            元/公里
                                        </div>
                                    </el-form-item>
                                </div>
                            </el-col>
                            <el-col :span="8">
                                <div class="agreedItem">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle">滞纳金</span>
                                        <e-switch
                                            v-model="form.lateFee"
                                        ></e-switch>
                                    </div>
                                    <el-form-item
                                        prop="lateFeeParam"
                                        :rules="{
                                            required: true,
                                            message: '请输入滞纳金计费规则',
                                            trigger: ['blur', 'change'],
                                            validator: (
                                                rule,
                                                value,
                                                callback
                                            ) =>
                                                validData(
                                                    rule,
                                                    value,
                                                    callback,
                                                    form.lateFee
                                                ),
                                        }"
                                    >
                                        <div
                                            class="agreedContent flex-row-center"
                                        >
                                            计费规则:逾期金额的
                                            <el-input
                                                style="
                                                    width: 100px;
                                                    margin: 0 8px;
                                                "
                                                v-model="
                                                    form.lateFeeParam
                                                "
                                                :disabled="
                                                    form.lateFee == 2
                                                        ? true
                                                        : false
                                                "
                                                onkeyup="value=value.replace(/[^0-9.]/g,'')"
                                                @input="checkLateFeeParam"
                                                @blur="lateFeeParamBlur"
                                            ></el-input>
                                            %
                                        </div>
                                    </el-form-item>
                                </div>
                                <div class="agreedItem">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle">超公里费</span>
                                        <e-switch
                                            v-model="form.overmileageFee"
                                        ></e-switch>
                                    </div>
                                    <el-form-item
                                        prop="overmileageFeeParam"
                                        :rules="{
                                            required: true,
                                            message: '请输入超公里费计费规则',
                                            trigger: ['blur', 'change'],
                                            validator: (
                                                rule,
                                                value,
                                                callback
                                            ) =>
                                                validData(
                                                    rule,
                                                    value,
                                                    callback,
                                                    form.overmileageFee
                                                ),
                                        }"
                                    >
                                        <div
                                            class="agreedContent flex-row-center"
                                        >
                                            单价:
                                            <el-input
                                                style="
                                                    width: 100px;
                                                    margin: 0 8px;
                                                "
                                                v-model="
                                                    form.overmileageFeeParam
                                                "
                                                :disabled="
                                                    form.overmileageFee == 2
                                                        ? true
                                                        : false
                                                "
                                                onkeyup="value=value.replace(/[^0-9.]/g,'')"
                                                @input="checkOvermileageFee"
                                                maxlength="9"
                                            ></el-input>
                                            元/公里
                                        </div>
                                    </el-form-item>
                                </div>
                            </el-col>
                            <el-col :span="8">
                                <div class="agreedItem" style="height: 228px">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle"
                                            >逾期规则(租金)</span
                                        >
                                        <e-switch
                                            v-model="form.overdueRules"
                                        ></e-switch>
                                    </div>
                                    <div
                                        class="agreedContent"
                                        style="margin-top: 35px"
                                    >
                                        <el-radio-group
                                            v-model="form.overdueRulesType"
                                            :disabled="
                                                form.overdueRules == 2
                                                    ? true
                                                    : false
                                            "
                                            @change="changeOverdueRulesType"
                                        >
                                            <el-radio :label="1">
                                                <el-form-item
                                                    prop="overdueRulesParam1"
                                                    :rules="{
                                                        required: true,
                                                        message:
                                                            '请输入逾期规则',
                                                        trigger: [
                                                            'blur',
                                                            'change',
                                                        ],
                                                        validator: (
                                                            rule,
                                                            value,
                                                            callback
                                                        ) =>
                                                            validData1(
                                                                rule,
                                                                value,
                                                                callback,
                                                                form.overdueRules,
                                                                1
                                                            ),
                                                    }"
                                                >
                                                    <div
                                                        class="flex-row-center"
                                                    >
                                                        逾期规则:超
                                                        <el-input
                                                            style="
                                                                width: 80px;
                                                                margin: 0 8px;
                                                            "
                                                            v-model="
                                                                form.overdueRulesParam1
                                                            "
                                                            :disabled="
                                                                form.overdueRules ==
                                                                2
                                                                    ? true
                                                                    : false
                                                            "
                                                            onkeyup="value=value.replace(/[^\d||/.]/g,'')"
                                                            oninput="if(value){value=value.replace(/[^\d]/g,'')} if(value==0 && value!=''){value=1}"
                                                            maxlength="6"
                                                        ></el-input>
                                                        自然日未付款
                                                    </div>
                                                </el-form-item>
                                            </el-radio>

                                            <el-radio
                                                :label="2"
                                                style="margin-top: 15px"
                                            >
                                                <el-form-item
                                                    prop="overdueRulesParam2"
                                                    :rules="{
                                                        required: true,
                                                        message:
                                                            '请输入逾期规则',
                                                        trigger: [
                                                            'blur',
                                                            'change',
                                                        ],
                                                        validator: (
                                                            rule,
                                                            value,
                                                            callback
                                                        ) =>
                                                            validData2(
                                                                rule,
                                                                value,
                                                                callback,
                                                                form.overdueRules,
                                                                2
                                                            ),
                                                    }"
                                                >
                                                    <div
                                                        class="flex-row-center"
                                                    >
                                                        逾期规则:次期
                                                        <el-input
                                                            style="
                                                                width: 80px;
                                                                margin: 0 8px;
                                                            "
                                                            v-model="
                                                                form.overdueRulesParam2
                                                            "
                                                            :disabled="
                                                                form.overdueRules ==
                                                                2
                                                                    ? true
                                                                    : false
                                                            "
                                                            onkeyup="value=value.replace(/[^\d||/.]/g,'')"
                                                            oninput="if(value){value=value.replace(/[^\d]/g,'')}  if(value>28){value=28} if(value==0&&value!=''){value=1}"
                                                            :maxlength="2"
                                                            :minlength="1"
                                                        ></el-input>
                                                        日前未付款
                                                    </div>
                                                </el-form-item>
                                            </el-radio>
                                        </el-radio-group>
                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                        <el-row :gutter="20">
                            <el-col :span="24">
                                <div class="agreedItem" style="height: auto">
                                    <div class="titleInfo flex-row-center-sb">
                                        <span class="ruleTitle">提前还车</span>
                                        <e-switch
                                            v-model="form.earlyReturn"
                                        ></e-switch>
                                    </div>
                                    <div style="padding-bottom: 20px">
                                        <el-table
                                            :data="form.earlyReturnRules"
                                            :header-cell-style="{
                                                background: '#FAFAFA',
                                                color: '#000000',
                                            }"
                                            border
                                            :key="isUpdate"
                                        >
                                            <el-table-column
                                                align="center"
                                                prop="reasonForEarlyReturn"
                                                label="提前还车"
                                                key="reasonForEarlyReturn"
                                                min-width="160"
                                            >
                                                <template v-slot="{ row }">
                                                    <el-form-item
                                                        style="
                                                            margin-top: 15px;
                                                            width: 100%;
                                                        "
                                                        label-width="0"
                                                        prop="reasonForEarlyReturn"
                                                        :rules="{
                                                            required: true,
                                                            message:
                                                                '请选择提前还车原因',
                                                            trigger: [
                                                                'blur',
                                                                'change',
                                                            ],
                                                            validator: (
                                                                rule,
                                                                value,
                                                                callback
                                                            ) =>
                                                                validData(
                                                                    rule,
                                                                    row.reasonForEarlyReturn,
                                                                    callback,
                                                                    form.earlyReturn
                                                                ),
                                                        }"
                                                    >
                                                        <el-select
                                                            v-model="
                                                                row.reasonForEarlyReturn
                                                            "
                                                            placeholder="请选择提前还车原因"
                                                            :disabled="
                                                                form.earlyReturn ==
                                                                2
                                                                    ? true
                                                                    : false
                                                            "
                                                        >
                                                            <el-option
                                                                v-for="dict in dict
                                                                    .type
                                                                    .reason_for_early_return"
                                                                :label="
                                                                    dict.label
                                                                "
                                                                :value="
                                                                    parseInt(
                                                                        dict.value
                                                                    )
                                                                "
                                                                :key="
                                                                    dict.value
                                                                "
                                                            ></el-option>
                                                        </el-select>
                                                    </el-form-item>
                                                </template>
                                            </el-table-column>
                                            <el-table-column
                                                align="center"
                                                prop="leaseTerm"
                                                label="已履行租期(月)"
                                                key="leaseTerm"
                                                min-width="160"
                                            >
                                                <template v-slot="{ row }">
                                                    <el-form-item
                                                        style="
                                                            margin-top: 15px;
                                                            width: 100%;
                                                        "
                                                        label-width="0"
                                                        prop="leaseTerm"
                                                        :rules="{
                                                            type: 'array',
                                                            required: true,
                                                            message:
                                                                '请输入已履行租期',
                                                            trigger: [
                                                                'blur',
                                                                'change',
                                                            ],
                                                            validator: (
                                                                rule,
                                                                value,
                                                                callback
                                                            ) =>
                                                                validData(
                                                                    rule,
                                                                    row.leaseTerm,
                                                                    callback,
                                                                    form.earlyReturn
                                                                ),
                                                        }"
                                                    >
                                                        <input-number-range
                                                            v-model="
                                                                row.leaseTerm
                                                            "
                                                            separator="/"
                                                            unit="月"
                                                            :type="1"
                                                            @input="
                                                                changeLeaseTerm(
                                                                    row,
                                                                    $event
                                                                )
                                                            "
                                                            :disabled="
                                                                form.earlyReturn ==
                                                                2
                                                                    ? true
                                                                    : false
                                                            "
                                                        ></input-number-range>
                                                    </el-form-item>
                                                </template>
                                            </el-table-column>
                                            <el-table-column
                                                align="center"
                                                prop="liquidatedDamagesScale"
                                                label="违约金比例"
                                                key="liquidatedDamagesScale"
                                                min-width="250"
                                            >
                                                <template v-slot="scope">
                                                    <el-form-item
                                                        style="
                                                            margin-top: 15px;
                                                            width: 100%;
                                                        "
                                                        label-width="0"
                                                        prop="liquidatedDamagesScale"
                                                        :rules="{
                                                            required: true,
                                                            message:
                                                                '请输入违约金比例',
                                                            trigger: [
                                                                'blur',
                                                                'change',
                                                            ],
                                                            validator: (
                                                                rule,
                                                                value,
                                                                callback
                                                            ) =>
                                                                validData(
                                                                    rule,
                                                                    scope.row.liquidatedDamagesScale,
                                                                    callback,
                                                                    form.earlyReturn
                                                                ),
                                                        }"
                                                    >
                                                        <div
                                                            class="flex-row-center"
                                                        >
                                                            剩余未履行租赁期应支付租金总额的
                                                            <el-input
                                                                style="
                                                                    width: 80px;
                                                                    margin: 0
                                                                        8px;
                                                                "
                                                                v-model="
                                                                    scope.row.liquidatedDamagesScale
                                                                "
                                                                onkeyup="value=value.replace(/[^0-9.]/g,'')"
                                                                @input="event => checkLiquidatedDamagesScale(event, scope.$index)"
                                                                @blur="event=>liquidatedDamagesScaleBlur(event, scope.$index)"
                                                                :disabled="
                                                                    form.earlyReturn ==
                                                                    2
                                                                        ? true
                                                                        : false
                                                                "
                                                            ></el-input>
                                                            %
                                                        </div>
                                                    </el-form-item>
                                                </template>
                                            </el-table-column>

                                            <el-table-column
                                                align="center"
                                                prop="fieldDict"
                                                label="操作"
                                                min-width="50"
                                            >
                                                <template v-slot="{ $index }">
                                                    <i
                                                        style="
                                                            color: #1890ff;
                                                            font-size: 20px;
                                                        "
                                                        class="el-icon-delete"
                                                        @click="
                                                            deleteEarlyReturnRules(
                                                                $index
                                                            )
                                                        "
                                                    ></i>
                                                </template>
                                            </el-table-column>
                                            <template v-slot:append>
                                                <div
                                                    class="flex-xy-center"
                                                    style="height: 30px"
                                                >
                                                    <el-button
                                                        :disabled="
                                                            form.earlyReturn ==
                                                            2
                                                                ? true
                                                                : false
                                                        "
                                                        type="text"
                                                        icon="el-icon-plus"
                                                        @click="
                                                            addEarlyReturnRules
                                                        "
                                                        >添加规则</el-button
                                                    >
                                                </div>
                                            </template>
                                        </el-table>
                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-col>
                <el-col :span="24" v-if="applicationType == 3">
                    <el-form-item label="特殊约定" prop="specialAgreement">
                        <el-input
                            type="textarea"
                            placeholder="请输入特殊约定"
                            v-model="form.specialAgreement"
                            maxlength="1000"
                            :rows="5"
                            show-word-limit
                        ></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="说明" prop="remark">
                        <el-input
                            type="textarea"
                            placeholder="请输入说明"
                            v-model="form.remark"
                            maxlength="500"
                            :rows="5"
                            show-word-limit
                        ></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="附件" prop="annex">
                        <image-common
                            :up-type="2"
                            v-model="form.annex"
                            info="上传附件"
                        ></image-common>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
import InputNumberRange from "@/components/InputNumberRange/index.vue";
import { getCompanyStandards } from "@/api/contractTemplate/templateUpdate";
import WordUpload from "@/components/FileUpload/wordUpload.vue";
import * as contractTemplateApi from "@/api/contractTemplate/contractTemplate";
import { isEmpty } from "lodash";
import {checkListNumberInput, checkNumberInput} from "@/utils/utils";

export default {
    components: { WordUpload, InputNumberRange },
    props: {
        applicationType: {
            type: Number,
            default: 3,
        },
        applicationNo: {
            type: [String, Number],
            default: "",
        },
        customerId: {
            type: [String, Number],
            default: "",
        },
    },
    dicts: ["reason_for_early_return"],
    data() {
        return {
            form: {
                newTemplateObj: null,
                specialAgreement: null,
                remark: null,
                contractAnnex: null,
                contractContent: null,
                onlyThis: 2,
                overdue: 1,
                overdueParam: null,
                offsite: 1,
                offsiteParam: null,
                overmileageFee: 1,
                overmileageFeeParam: null,
                lateFee: 1,
                lateFeeParam: null,
                overdueRules: 1,
                overdueRulesType: 1,
                overdueRulesParam: null,
                overdueRulesParam1: null,
                overdueRulesParam2: null,
                earlyReturn: 1,
                earlyReturnRules: [],
                annex: null,
            },
            rules: {
                newTemplateObj: [
                    {
                        required: true,
                        message: "请选择新合同模版",
                        trigger: ["blur", "change"],
                    },
                ],
                specialAgreement: [
                    {
                        required: true,
                        message: "请输入特殊约定",
                        trigger: "blur",
                    },
                ],
                remark: [
                    { required: true, message: "请输入说明", trigger: "blur" },
                ],
            },
            list: [],
            isUpdate: Math.random(),
        };
    },
    computed: {},
    customerId: {
        handler(val) {
            if (!this.isNull(val)) {
                this.getTemplateList();
            } else {
                this.list = [];
            }
        },
        immediate: true,
    },
    methods: {
      changeOverdueRulesType(val){
        this.$refs.form3.validateField(['overdueRulesParam1','overdueRulesParam2'])
      },
        //公司标准模版合同详情
        getCompanyContractTemplateDetail(newTemplateObj) {
            let templateId = newTemplateObj?.value;
            contractTemplateApi
                .contractTemplateDetails(templateId)
                .then((res) => {
                    const data = res.data;
                    this.form.overdue = data?.overdue;
                    this.form.overdueParam = data?.overdueParam;
                    this.form.offsite = data?.offsite;
                    this.form.offsiteParam = data?.offsiteParam;
                    this.form.overmileageFee = data?.overmileageFee;
                    this.form.overmileageFeeParam = data?.overmileageFeeParam;
                    this.form.lateFee = data?.lateFee;
                    this.form.lateFeeParam = data?.lateFeeParam;
                    this.form.overdueRules = data?.overdueRules;
                    this.form.overdueRulesType = data?.overdueRulesType;
                    if (data.overdueRulesParam) {
                        if (data.overdueRulesType == 1) {
                            this.$set(
                                this.form,
                                "overdueRulesParam1",
                                data.overdueRulesParam
                            );
                        } else if (data.overdueRulesType == 2) {
                            this.$set(
                                this.form,
                                "overdueRulesParam2",
                                data.overdueRulesParam
                            );
                        }
                    }
                    this.form.earlyReturn = data?.earlyReturn;
                    if (
                        data.earlyReturnRules &&
                        data.earlyReturnRules.length > 0
                    ) {
                        this.form.earlyReturnRules = data.earlyReturnRules.map(
                            (item) => {
                                this.$set(item, "leaseTerm", [
                                    item.minLeaseTerm,
                                    item.maxLeaseTerm,
                                ]);
                                return item;
                            }
                        );
                    } else {
                        this.form.earlyReturnRules = [];
                    }
                });
        },

        //获取其他生效合同模版
        getTemplateList() {
            getCompanyStandards({
                applicationNo: this.applicationNo,
                customerId: this.customerId,
            }).then((res) => {
                this.list = res.data;
            });
        },
        uploadSuccess(data) {
            this.form.contractContent = data?.richText;
            this.form.contractAnnex = data?.ossId;
        },
        // 查看合同模版详情
        goTemplateDetail() {
            this.$emit("getContractContent", this.form?.newTemplateObj?.value);
        },
        // 添加规则
        addEarlyReturnRules() {
            const ruleObj = {
                reasonForEarlyReturn: null,
                selected: 1,
                minLeaseTerm: null,
                maxLeaseTerm: null,
                liquidatedDamagesScale: null,
                leaseTerm: [],
            };
            if (this.form.earlyReturnRules == null) {
                this.form.earlyReturnRules = [];
            }
            this.form.earlyReturnRules.push(ruleObj);
        },
        // 删除规则
        deleteEarlyReturnRules(index) {
            this.form.earlyReturnRules.splice(index, 1);
        },
        //租期发生改变
        changeLeaseTerm(row, val) {
            row.minLeaseTerm = val[0] ?? null;
            row.maxLeaseTerm = val[1] ?? null;
        },
        saveForm() {
            let flag = false;
            this.$refs["form3"].validate((valid) => {
                if (valid) {
                    flag = true;
                } else {
                    flag = false;
                }
            });
            if (flag) {
                if (this.form.overdueRulesType == 1) {
                    this.form.overdueRulesParam = this.form?.overdueRulesParam1;
                } else if (this.form.overdueRulesType == 2) {
                    this.form.overdueRulesParam = this.form?.overdueRulesParam2;
                }
                console.log("表单3||4-----", this.form);
                return this.form;
            }
        },
        validData(rule, value, callback, switchStatus) {
            if (
                switchStatus == 1 &&
                rule.required &&
                (!value || (rule.type = "array" && value.length == 0))
            ) {
                callback(new Error(rule.message));
            } else {
                callback();
            }
        },
        validData1(rule, value, callback, switchStatus, type) {
            if (
                switchStatus == 1 &&
                type == this.form.overdueRulesType &&
                rule.required &&
                !value
            ) {
                callback(new Error(rule.message));
            } else {
                callback();
            }
        },
        validData2(rule, value, callback, switchStatus, type) {
            if (
                switchStatus == 1 &&
                type == this.form.overdueRulesType &&
                rule.required &&
                !value
            ) {
                callback(new Error(rule.message));
            } else {
                callback();
            }
        },
      //逾期还车输入校验
      checkOverdueParam(){
        checkNumberInput(this.form.overdueParam, (newValue)=>{
          if (newValue>10000){
            this.form.overdueParam=10000
          }else{
            this.form.overdueParam=newValue
          }
        })
      },
      overdueParamBlur(event){
        const value = event.target.value;
        if(value!=""&&value!=null&&value<0.01){
          this.form.overdueParam = 0.01
        }
      },

      //异地还车规则输入校验
      checkOffsiteParam(){
        checkNumberInput(this.form.offsiteParam, (newValue)=>{
          this.form.offsiteParam=newValue
        })
      },

      //滞纳金规则输入校验
      checkLateFeeParam() {
        console.log('1111',this.form.lateFeeParam)
        checkNumberInput(this.form.lateFeeParam, (newValue) => {
          if (newValue > 10000) {
            this.form.lateFeeParam = 10000
          } else {
            this.form.lateFeeParam = newValue
          }
          console.log('222',this.form.lateFeeParam)
        })
      },
      lateFeeParamBlur(event) {
        const value = event.target.value;
        if(value!=""&&value!=null&&value<0.01){
          this.form.lateFeeParam = 0.01
        }
      },

      //超公里费规则输入校验
      checkOvermileageFee(){
        checkNumberInput(this.form.overmileageFeeParam, (newValue)=>{
          this.form.overmileageFeeParam=newValue
        })
      },

      //校验违约金比例
      checkLiquidatedDamagesScale(event,index){
        const newValue=checkListNumberInput(event);
        if (newValue>10000){
          this.form.earlyReturnRules[index].liquidatedDamagesScale=10000
        }else{
          this.form.earlyReturnRules[index].liquidatedDamagesScale=newValue
        }
      },
      liquidatedDamagesScaleBlur(event, index){
        const value = event.target.value;
        if(value!=""&&value!=null&&value<0.01){
          this.form.earlyReturnRules[index].liquidatedDamagesScale = 0.01
        }
      },
    },
    mounted() {
        this.getTemplateList();
    },
};
</script>

<style lang="scss" scoped>
.agreedItem {
    box-sizing: border-box;
    padding: 10px 20px 0;
    border-radius: 6px;
    border: 1px solid #dadada;
    margin-bottom: 20px;
    height: 106px;
    font-size: 14px;
    color: #333333;

    .titleInfo {
        margin-bottom: 8px;

        .ruleTitle {
            font-weight: bold;

            &::before {
                content: "*";
                color: #f5222d;
                position: relative;
                top: 2px;
                margin-right: 4px;
            }
        }
    }

    .agreedContent {
        //margin-top: 15px;
    }
}

::v-deep .el-radio {
    color: #606266;
    font-weight: 500;
    line-height: 1;
    position: relative;
    cursor: pointer;
    display: inline-block;
    white-space: nowrap;
    outline: none;
    font-size: 14px;
    margin-right: 30px;
    -moz-user-select: none;
    -webkit-user-select: none;
    display: flex;
}

::v-deep .el-radio__label {
    font-size: 14px;
    padding-left: 10px;
    position: relative;
    top: -10px;
}
</style>
